<template>
  <div class="form-layout form-layout4">
    <!--左侧导航-->
    <div class="nav-left">
      <customAnchor :itemList="[
        { name: 'box-top', title: '开票汇总' },
        { name: 'box-dtl', title: '待开明细' }]" />
    </div>
    <!--表单区域-->
    <div class="form-right" ref="formRight">
      <div id="box-top" class="box-title">开票汇总<span class="span-tip">可根据实际需要进行选择</span></div>
      <customForm
        :data="formTop"
        ref="editForm"
        style="padding: 10px 20px"
        :rules="rules"
        :label-width="80"
      >
        <template #content>
          <customFormItem
            :labelWidth="0"
            label="汇总条件"
            name="groupType"
            :parent="_self"
            :form="formTop"
            :type="constCommon.formItemType.radio.name"
            :config="{options: constCommon.busConst.invoiceGroupList,  isRadioButton: true}"
            class="form-item-group-by"
            @change="groupTypeChange"
            full-width
          />

          <customFormItem label="医院" name="hospitalId" :parent="_self" :form="formTop" ref="hospitalId"
                          :type="constCommon.formItemType.selectStatic.name" :config="{options: utilVuex.getHospitalList()}"
          />
          <span class="span-tip">每个医院需要单独开单</span>
        </template>
      </customForm>
      <div id="box-dtl" class="box-title">待开明细<span class="span-tip">按照开票汇总条件汇总展示</span></div>
      <data-view
        propViewKey="bill_item_for_invoice_add"
        :propIsTdesign="true"
        :propAutoFetchData="false"
        :propUserParam="cpPropUserParam"
        @extra-button-click="extraButtonClick"
        ref="dvList"
        :propHideColumns="cpDtlPropHideColumns"
      />
    </div>
  </div>
</template>

<script>
import customAnchor from '@/components/custom/form/customAnchor.vue'

export default {
  help: '开票单新增-列表',
  data() {
    return {
      formTop: {
      },
      rules: {
        hospitalId: [{ required: true, message: '请选择', trigger: 'blur' }],
        groupType: [{ required: true, message: '请选择', trigger: 'blur' }],
      }
    }
  },
  components: {
    customAnchor
  },
  methods: {
    // 加载数据
    loadDtl() {
      if (this.strings.isBlank(this.formTop.hospitalId)) {
        this.$refs.hospitalId.focus();
        this.utilMessage.warning('请选择医院')
        return
      }
      this.$nextTick(() => {
        let wrapper = this.$newWrapper()
        this.$refs.dvList.setQueryWrapper(wrapper)
      })
    },
    // 分组条件变化后
    groupTypeChange(valueThis) {
      this.$set(this.formTop, 'groupType', valueThis)
      if (this.strings.isBlank(this.formTop.hospitalId)) {
        return
      }
      this.loadDtl()
    },
    // 生成开票单
    toAdd() {
      let selectList = this.$refs.dvList.getGrid().getCheckboxRecords()
      this.utilVue.loadShow(true)
      this.formTop.items = selectList
      this.$ajax.post(`/settlement/invoices/buildInvoice`, this.formTop).then((response) => {
        this.utilVue.loadHide()
        if (response.code == 0) {
          this.loadDtl()
          this.toAddSuccess(response.data)
        }
      })

    },
    // 生成开票单
    toAddSuccess(data) {
      this.utilMessage.confirm(`生成${data.length}张开票单，是否打开第一个进行审核[${data[0].code}]`, () => {
        this.utils.openMenu('audit_index',{id: data[0].id})
      })
    },
    // 扩展按钮事件
    extraButtonClick({button, data, index}) {
      let buttonKey = button.key
      if (buttonKey === 'toAdd') { // 生成开票单
        let selectList = this.$refs.dvList.getGrid().getCheckboxRecords()
        if (selectList.length == 0) {
          this.utilMessage.warning('请选择数据')
          return
        }
        this.utilMessage.confirm('确认将所选择数据进行开票?', () => {
          this.toAdd()
        })
      }
    },
    menuActiveCall() {
      if (this.strings.isBlank(this.formTop.hospitalId)) {
        return
      }
      this.loadDtl()
    }
  },
  mounted() {
    this.$set(this.formTop, 'groupType', this.constCommon.busConst.invoiceGroupList[0].value)
    if (this.utilVuex.getHospitalList().length == 1) {
      this.$set(this.formTop, 'hospitalId', this.utilVuex.getHospitalList()[0].value)
      this.loadDtl()
    }
  },
  computed: {
    cpFormGroupType() {
      return this.strings.defaultString(this.formTop.groupType,this.constCommon.busConst.invoiceGroupList[0].value)
    },

    cpPropUserParam() {
      return {groupType: this.cpFormGroupType,hospitalId: this.formTop.hospitalId}
    },

    // 根据不同分组条件隐藏列
    cpDtlPropHideColumns() {
      let find = this.constCommon.busConst.invoiceGroupList.find(item => item.value == this.cpFormGroupType)
      if (find.hideColumns) {
        return  find.hideColumns
      }
      return []
    }
  }
}
</script>


<style lang="scss" scoped>
.form-item-group-by /deep/{
  .t-form__controls-content{
    width: auto !important;
  }
  .t-radio{
    width: 250px !important;
  }
}
</style>

